<template>
  <div class="con">
      <router-link to="/home" class="item">综合排序<i class="i"></i></router-link>
       <router-link to="/home"  class="item" >销量最高</router-link>
        <router-link to="/home"  class="item" >距离最近</router-link>
         <router-link to="/home"  class="item">筛选<img src="shaixuan.png" alt=""></router-link>
  </div>
</template>

<script>

export default {

}
</script>

<style scoped>
.con{
    list-style: none;

}
a{
    text-decoration: none;
}
.item{
    position: relative;
    display: inline-block;
    width: 25%;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    color: #666;
}
.i{
    display: inline-block;
    width: 5px;
    height: 5px;
    margin: 0 0 3px 5px;
    border-top: 1px solid #666;
    border-left: 1px solid #666;
    -webkit-transform: rotateZ(
-135deg
);
    transform: rotateZ(
-135deg
);
    margin-top: -10px;
}
img{
    display: inline-block;
    width: 15px;
    height: 15px;
    vertical-align: text-bottom;
}
</style>